import 'package:aidou/style/style.dart';
import 'package:aidou/widgets/animation/fadeAnimated.dart';
import 'package:aidou/widgets/animation/scaleAnimated.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

/// 自定义dialog
/// END
class CustomDialog extends Dialog {
  final double width;
  final double height;
  final String? title; // 顶部标题
  final Widget content; // 内容
  final String cacnelText; // 取消文本
  final String confirmText; // 确定文本
  final Function? cancelCallback; // 取消回调函数
  final Function? confirmCallback; // 确定回调函数

  const CustomDialog({
    Key? key,
    this.width: 640,
    this.height: 400,
    this.title,
    required this.content,
    this.cacnelText: '取消',
    this.confirmText: '确定',
    this.cancelCallback,
    this.confirmCallback,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      // 点击遮罩层隐藏弹框
      child: Material(
        type: MaterialType.transparency,
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              GestureDetector(
                // 点击遮罩关闭弹框，并且点击非遮罩区域禁止关闭
                onTap: () {},
                child: FadeAnimatedContent(
                  show: true,
                  child: ScaleAnimatedContent(
                    show: true,
                    child: dialogContent(context),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
      onTap: () {
        Navigator.pop(context);
      },
    );
  }

  Widget dialogContent(context) {
    return Container(
      width: ScreenUtil().setWidth(this.width),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(16.w),
        color: Colors.white,
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Visibility(
            visible: this.title != null ? true : false,
            child: Container(
              padding: EdgeInsets.only(top: 15.w, bottom: 15.w),
              alignment: Alignment.center,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(16.w),
                  topRight: Radius.circular(16.w),
                ),
                color: ColorPlate.back3,
              ),
              child: Text(
                '${this.title}',
                style: TextStyle(
                  fontSize: 32.sp,
                  height: 2,
                  color: ColorPlate.color3,
                  fontWeight: FontWeight.w600,
                ),
              ),
            ),
          ),
          Container(
            padding: EdgeInsets.all(40.w),
            alignment: Alignment.center,
            child: this.content,
          ),
          Container(
            height: 80.w,
            decoration: BoxDecoration(
              border: Border(
                top: BorderSide(width: 1, color: Colors.black12),
              ),
            ),
            child: Row(
              children: <Widget>[
                Expanded(
                  flex: 1,
                  child: InkWell(
                    child: Container(
                      height: double.infinity,
                      alignment: Alignment.center,
                      decoration: BoxDecoration(
                        border: Border(
                          right: BorderSide(
                            width: 1,
                            color: Colors.black12,
                          ),
                        ),
                      ),
                      child: Text(
                        '${this.cacnelText}',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          color: ColorPlate.color6,
                          fontSize: 32.sp,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ),
                    onTap: () {
                      this.cancelCallback?.call();
                      Navigator.pop(context);
                    },
                  ),
                ),
                Expanded(
                  flex: 1,
                  child: InkWell(
                    child: Container(
                      height: double.infinity,
                      alignment: Alignment.center,
                      child: Text(
                        '${this.confirmText}',
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          color: ColorPlate.blue,
                          fontSize: 32.sp,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ),
                    onTap: () {
                      this.confirmCallback?.call();
                      Navigator.pop(context);
                    },
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
